let handleMouseMoveRef;
let isMouseInteractionEnabled = true;
let isAnimationPaused = false;
let decelerationActive = false; // 用于标记是否正在减速
const decelerationRate = 0.95; // 减速率

function initialize() {
    const canvas = document.querySelector('canvas');
    const context = canvas.getContext('2d');

    function resizeCanvas() {
        canvas.width = window.innerWidth;
        canvas.height = window.innerHeight;
        stars.forEach(star => {
            star.x = Math.random() * canvas.width;
            star.y = Math.random() * canvas.height;
        });
    }

    function createStars() {
        for (let i = 0; i < STAR_COUNT; ++i) {
            stars.push({
                x: Math.random() * canvas.width,
                y: Math.random() * canvas.height,
                z: Math.random() * 1.5 + 0.5,
                vx: 0,
                vy: 0
            });
        }
    }

    function handleMouseMove(event) {
        if (isMouseInteractionEnabled) { // 仅在允许的情况下更新鼠标位置
            mouse.x = event.clientX;
            mouse.y = event.clientY;
        }
    }

    function animate() {
        if (!isAnimationPaused || decelerationActive) { // 如果动画未被暂停或者正在减速，则执行动画逻辑
            context.clearRect(0, 0, canvas.width, canvas.height);
            stars.forEach((star) => {
                if (isMouseInteractionEnabled) {
                    let dx = mouse.x - star.x;
                    let dy = mouse.y - star.y;
                    let distance = Math.sqrt(dx * dx + dy * dy);

                    if (distance < mouse.radius) {
                        let force = (mouse.radius - distance) / mouse.radius;
                        let angle = Math.atan2(dy, dx);
                        star.vx += force * Math.cos(angle) * 0.1;
                        star.vy += force * Math.sin(angle) * 0.1;
                    } else {
                        star.vx *= decelerationRate;
                        star.vy *= decelerationRate;
                    }
                } else if (decelerationActive) {
                    star.vx *= decelerationRate;
                    star.vy *= decelerationRate;
                }

                star.x += star.vx / star.z;
                star.y += star.vy / star.z;

                if (star.x < 0 || star.x > canvas.width) star.vx = -star.vx;
                if (star.y < 0 || star.y > canvas.height) star.vy = -star.vy;

                context.beginPath();
                context.arc(star.x, star.y, 1 / star.z, 0, Math.PI * 2, false);
                context.fillStyle = 'rgba(255, 255, 255, ' + (1 / star.z) + ')';
                context.fill();
            });
        }
        requestAnimationFrame(animate);
    }

    window.addEventListener('resize', resizeCanvas);
    handleMouseMoveRef = handleMouseMove;
    canvas.addEventListener('mousemove', handleMouseMoveRef);

    let choose = document.querySelector('.choose');
    let container = document.querySelector('.container');
    choose.addEventListener('mouseover', function () {
        isMouseInteractionEnabled = false;
        decelerationActive = true; // 标记开始减速
    });
    container.addEventListener('mouseover', function () {
        isMouseInteractionEnabled = false;
        decelerationActive = true;
    });
    choose.addEventListener('mouseout', function () {
        isMouseInteractionEnabled = true;
        decelerationActive = false; // 结束减速
    });
    container.addEventListener('mouseout', function () {
        isMouseInteractionEnabled = true;
        decelerationActive = false;
    });

    resizeCanvas();
    createStars();
    animate();
}

const STAR_COUNT = (window.innerWidth + window.innerHeight) / 2;
const stars = [];
let mouse = { x: null, y: null, radius: 100 };

initialize();